<template>
	<view>
		
<image src="../../static/images/user_bg.jpg" mode="aspectFill" style="width: 100%;height:250px;" class="my-container" ></image>
		<view style="width: 100%;height:150px;" >
			
		</view>
			

		
		<view class="radius margin" style="position: relative;top: -250px;" v-if="apiToken">
			<view class="flex">
				<view class="margin-right">
					<image :src="userinfo.avatar_url" mode="" class="cu-avatar lg round"></image>
				</view>
				<view class="">
					<view class=" text-xxl text-bold">{{userinfo.nick_name}}</view>
					<view class="">加入{{userinfo.join_time}}</view>
				</view>
			</view>		 
		</view>
		
		<view class="radius margin" style="position: relative;top: -250px;" v-else>
			<view class="flex justify-between">
				<view class="margin-right">
					<image src="../../static/images/logo.png" mode="" class="cu-avatar  round"></image>
				</view>
				
					<u-button type="primary" shape="square" size="medium" @click="goLogin" >请先登录</u-button>
				
			</view>	
		</view>
		
		<!-- <view class="flex justify-around  bg-white margin padding radius" style="position: relative;top: -220px;">
			<view class="flex flex-direction text-center">
				<text>0</text>
				<text>点赞</text>
			</view>
			<view class="flex flex-direction text-center">
				<text>0</text>
				<text>收藏</text>
			</view>
			<view class="flex flex-direction text-center">
				<text>0</text>
				<text>收藏</text>
			</view>
		</view>
		</view> -->
		
		
		<view class="cu-list menu sm-border card-menu shadow-lg" style="position: relative;top: -180px;">
		
			
			<view class="cu-item arrow" @tap="noticeList">
				<view class="content">
					<text class="cuIcon-noticefill text-yellow"></text>
					<text class="">公告</text>
				</view>
			</view>
		</view>
		
		<!-- 菜单 -->
		<view class="cu-list menu sm-border card-menu shadow-lg" style="position: relative;top: -180px;">
		
			
			
			<view class="cu-item arrow" @tap="goAbout">
				<view class="content">
					<text class="cuIcon-creativefill text-orange"></text>
					<text class="">关于程序</text>
				</view>
			</view>
			
			
			<view class="cu-item" @tap="copyWeixin">
				<view class="content padding-tb-sm" >
						<text class="cuIcon-weixin text-green"></text>
							<text class="">添加微信</text>
				</view>
				<view class="action">
					{{config.weixin}}
				</view>
			</view>
		
			
			<view class="cu-item arrow" @tap="goAgreement">
				<view class="content">
					<text class="cuIcon-text text-blue"></text>
					<text class="">隐私政策</text>
				</view>
			</view>
			<view class="cu-item arrow" @tap="quit">
				<view class="content">
					<text class="cuIcon-exit text-gray"></text>
					<text class="">清理缓存</text>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				config:this.CmsConfig,
				apiToken:{},
				userinfo:{}
			}
		},
		onShow() {
			try {
			    const value = uni.getStorageSync('token');
				if(value){
					this.getUserInfo()
					this.apiToken = value;
				}else{
					
					this.apiToken = false;
				}
				
				
			} catch (e) {
			    // error
				
			}
		},
		onLoad() {
			
			
			
		},
		methods: {
			call(){
				const _this = this;
				uni.makePhoneCall({
				    phoneNumber: _this.config.phone //仅为示例
				});
			},
			copyWeixin(){
				const _this = this;
				uni.setClipboardData({
				    data: _this.config.weixin,
				    success: function () {
				        uni.showToast({
				            title: '复制微信成功',
				            duration: 2000
				        });
				    }
				});
			},
			// 通知列表
			noticeList(){
				uni.navigateTo({
					url:'../notice/list'
				})
			},
			goAbout(){
				uni.navigateTo({
					url:'../pages/about'
				})
			},
			goAgreement(){
				uni.navigateTo({
					url:'../pages/agreement'
				})
			},
			goLogin(){
				uni.navigateTo({
					url:'../login/login'
				})
			},
			getUserInfo(){
				const _this = this;
				_this.$apiResquest({
					url: 'cms/userinfo',
					method: 'GET'
				}).then(function(res) {
				
				
					_this.userinfo = res.data
				
				})
			},
			quit(){
				uni.clearStorage()
				uni.showToast({
					title:'清理成功',
					icon:'none'
				})
			}
		}
	}
</script>

<style>
page{
			background-color: #F7F8FA;
		}
		
		
		.customer-service{
		  display: inline;
		 font-size: 30rpx;
		 padding:0 6rpx;
		 color:#3C91FB;
		 background-color: #F2F2F2;
		}
		.my-container:before {
		  content: ' ';
		  display: block;
		  position: absolute;
		  left: 0;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  z-index: 1;
		  opacity: 1;
		  background-image: linear-gradient(to top, rgba(247, 248, 250, 1), rgba(247, 248, 250, 0));
		  background-repeat: no-repeat;
		  background-position: 50% 0;
		  background-size: cover;
		}
	
</style>
